<template>
  <page-header-wrapper>
    <a-card :bordered="false" style="margin-bottom: 10px">
      <a-row type="flex" justify="space-between">
        <a-col>
          <span class="info">{{entInfo.entName}}</span>
        </a-col>
        <a-col>
          <a-button class="btn" @click="back">返回</a-button>
        </a-col>
      </a-row>
    </a-card>
    <a-card :bordered="false" title="企业基础信息">
      <div class="pl-40">
        <div class="picture">
          <p class="bottom" style="margin-right: 30px">企业LOGO：</p>
          <div v-if="entInfo.entLogo">
            <img :src=entInfo.entLogo alt />
          </div>
          <div v-else>
            <img src="@/assets/images/defult_img.png" alt />
          </div>
        </div>
        <ul>
          <li class="list-info">
            <span>企业名称：</span>
            {{entInfo.entName}}
          </li>

          <li class="list-info">
            <span>统一信用代码：</span>
            {{entInfo.entCreditCode}}
          </li>
          <li class="list-info">
            <span>联系人：</span>
            <span style="color:#000" v-if="entInfo.contacts">{{entInfo.contacts}}</span>
            <span style="color:#000" v-else>{{entInfo.entLerepName}}</span>
          </li>
          <li class="list-info">
            <span>联系电话：</span>
            {{entInfo.phone}}
          </li>
          <li class="list-info">
            <span>企业地址：</span>
            {{entInfo.entAddress}}
          </li>
          <li class="list-info">
            <span>企业网址：</span>
            {{entInfo.webAddress}}
          </li>
          <li class="list-info">
            <span>企业简介：</span>
            {{entInfo.introduction}}
          </li>

        </ul>

        <div v-if="entInfo.auditStatus==3">
          <h3 class="part-title">审核不通过的原因:</h3>
          <p>{{entInfo.auditRemark}}</p>
        </div>
        <div v-if="isExamine" style="margin-left: 40%; margin-top: 30px">
          <a-button type="primary" @click="success">通过</a-button>
          <a-button type="danger" @click="showModal" class="ml-20">不通过</a-button>
        </div>
      </div>

      <a-modal v-model="visible" title="审核退回" @ok="handleOk" :width="800">
        <!-- <a-form-model :model="form"  ref="form" :rules="rules" :label-col="labelCol" :wrapper-col="wrapperCol">
          <a-form-model-item label="审核不通过原因:">
            <a-textarea v-model="form.message" style="margin-left: 50px" :auto-size="{ minRows: 7, maxRows: 50 }" />
          </a-form-model-item>
        </a-form-model> -->
        <a-form-model :model="form" ref="form" :rules="rules">
          <a-form-model-item label="审核不通过原因:" prop="message">
            <a-textarea v-model="form.message" :auto-size="{ minRows: 7, maxRows: 50 }" />
          </a-form-model-item>
        </a-form-model>
      </a-modal>
    </a-card>
  </page-header-wrapper>
</template>
<script>
import { getEntBaseInfoById, checkEntBase } from '@/api/entVerify'
export default {
  data() {
    return {
      entId: '',
      entInfo: {
        userId: '',
        entLogo: '',
        entName: '',
        entCreditCode: '',
        contacts: '',
        phone: '',
        entAddress: '',
        introduction: '',
      },
      visible: false,
      isPass: true,
      labelCol: { span: 4 },
      wrapperCol: { span: 15 },
      form: {
        message: '',
      },
      rules: {
        message: [
          {
            required: true,
            message: '请输入审核不通过原因',
            trigger: 'blur',
          },
        ],
      },
      isExamine: false,
    }
  },
  methods: {
    back() {
      this.$router.back()
    },
    showModal() {
      this.visible = true
    },
    handleOk() {
      let that = this
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.isPass = false
          const msg = '审核处理完成！'
          this.checkEntBase(msg)
        } else {
          console.log('error submit!!')
          return false
        }
      })

      // this.$message.success('审核处理完成！')
    },
    success() {
      var that = this
      this.$confirm({
        title: '您审核确定要通过此信息吗?',
        okText: '确定',
        okType: 'danger',
        cancelText: '取消',
        onOk() {
          // 点击确定
          that.isPass = true
          const msg = '审核通过！'
          that.checkEntBase(msg)
        },
        onCancel() {
          // 点击取消
          console.log('Cancel')
        },
      })
      // this.isPass = true;
      // const msg = '审核通过！';
      // this.checkEntBase(msg);
      // this.$message.success('审核通过！')
    },
    //获取详细信息
    getInfoById() {
      getEntBaseInfoById(this.entId)
        .then((res) => {
          console.log('获取信息')
          console.log(res)
          if (res.code == 200) {
            this.entInfo = res.data
          }
          if (res.data.auditStatus == 1) {
            this.isExamine = true
          }
        })
        .catch((err) => {
          console.log(err)
        })
    },
    checkEntBase(msg) {
      const isPass = this.isPass
      let _param = {
        id: this.entId,
        owner: this.entInfo.userId,
        isPass: isPass,
        message: this.form.message,
        entId: this.entInfo.entCreditCode
      }
      checkEntBase(_param)
        .then((res) => {
          console.log(res)
          if (res.code === 200) {
            this.$message.success(msg)
            this.visible = false
            this.$router.push('/infoVerify/EnterpriseInfo/list')
          } else {
            this.$message.error('失败')
          }
        })
        .catch((err) => {
          console.log(err)
        })
    },
  },
  created() {
    if (this.$route.query.id) {
      this.entId = this.$route.query.id
      this.getInfoById()
    }
  },
  mounted() {
    // console.log(this.$router.params)
  },
}
</script>
<style lang="less" scoped>
.info {
  font-family: 'Arial Negreta', 'Arial';
  font-weight: 700;
  font-style: normal;
  font-size: 24px;
  color: #333333;
}
// .btn {
//   border-radius: 47%;
//   transform: scale(1, 1.2);
// }
.picture {
  margin-bottom: 20px;
  display: flex;
  overflow: hidden;
  background-size: cover;
}
.picture img {
  // margin-top: 50px;
  width: 120px;
  height: 115px;
  cursor: pointer;
  transition: all 0.6s;
}
.picture img:hover {
  transform: scale(1.4);
}
.top {
  font-family: 'Arial Negreta', 'Arial';
  font-weight: 700;
  font-size: 18px;
  color: #030303;
  margin-left: 30%;
}
.list-info {
  border-bottom: 1px dashed #ebeef5;
  line-height: 24px;
  padding: 10px 0;
  color: #030303;
  span {
    color: #909399;
  }
}
</style>